<extend name="./common" />
<block name='css'>
  <style type="text/css">
    .tab-pane{
      padding-top: 15px;
    }
    #myTab>li{
      width: 50%;text-align: center;
    }
  </style>
  </block>
  <block name="content">
	 <div class="content-wrap"><!--内容-->
    <div class="content">
      <div class="row tags-content content-block">
        <h2 class="title"><strong>本站标签</strong></h2>
        

        <ul id="myTab" class="nav nav-tabs">
          <li class="active">
            <a href="#home" data-toggle="tab">
               动态标签
            </a>
          </li>
          <li><a href="#aa" data-toggle="tab">静止标签</a></li>
        </ul>
        <div id="myTabContent" class="tab-content">
          <div class="tab-pane fade in active" id="home">
            <div id='tag-cloud'></div> 
          </div>
          <div class="tab-pane fade" id="aa">
              <?php
                $tags=array_unique(explode(',',$tags));
                foreach($tags as $tag){
                  echo "<div class='col-xs-3' style='width: auto;'><span class='tags' data-toggle='tooltip' data-placement='bottom' title='查看关于 $tag 的文章'>
                  <a href='".U('index/articles/tag/'.$tag)."'>".strtoupper($tag)."</a></span></div>";
                }
              ?>
          </div>
        </div>

      </div>
    </div>
  </div>

  </block>

  <block name='js'>
  <script src="__PUBLIC__/static/home/js/jquery.svg3dtagcloud.min.js"></script>
<script>
      $( document ).ready( function() {
            var entries = [ 
              <?php
                foreach($tags as $tag){
                  echo "{ label: '".$tag."', url: '".U('index/articles/tag/'.$tag)."', target: '_top' },";
                }
              ?>
            ];

            var settings = {
                entries: entries,
                width: '100%',
                height: 100,
                radius: '75%',
                radiusMin: 75,
                bgDraw: true,
                bgColor: '#ffffff',
                opacityOver: 1.00,
                opacityOut: 0.05,
                opacitySpeed: 6,
                fov: 800,
                speed: 0.5,
                fontFamily: 'Oswald, Arial, sans-serif',
                fontSize: '15',
                fontColor: '#000',
                fontWeight: 'bold',
                fontStyle: 'normal',
                fontStretch: 'narrower',
                fontToUpperCase: true
            };
            $( '#tag-cloud' ).svg3DTagCloud( settings );

    } );
        
    </script>
  </block>